<template>
    <div id="container" style="width: 100%; height: 545px"></div>
</template>

<script>
    export default {
        name: "Map",
        data() {
            return {}
        },
        created() {

        },
        mounted() {
            var map = new AMap.Map("container", {
                zoom: 16,
                center: [113.72606,23.277324],
                resizeEnable: true,
                mapState: 'amap://style/whitesmoke'
            })
            //
            // 广州应用科技学院官方
            //     [实地认证] 资质已通过第三方核验
            //
            // 官网：www.gzasc.edu.cn
            //
            // 电话：020-82856988
            //
            // 地址：广东省广州市增城区朱村街朱村大道东432号
            //
            var content = [
                "<div style='font-size: 10px'><div><img width='180px' height='40px' src='https://www.gzasc.edu.cn/uploadfiles/2021/04/20210428005255362.png?bG9nbyDkuqTkupIucG5n'></div><div><span style='color: blue'>[实地认证]</span><span>  资质已通过第三方核验</span></div> <div>电话：020-828569883</div> <div>地址：广东省广州市增城区朱村街朱村大道东432号</div></div>"
            ]
            var infoWindow = new AMap.InfoWindow({
                content: content
            })
            var clickHandler = function (e) {
                infoWindow.open(map, map.getCenter())
            }
            var marker = new AMap.Marker({
                position: new AMap.LngLat(113.72606,23.277324),
                title: '广州应用科技学院',
                // icon: 'http://trustcdn.baidu.com/officialcard/d0e1aacce5e6b86b1d22b981b0a1ed77_originalsize.jpeg'
                icon: new AMap.Icon({
                    image: "http://trustcdn.baidu.com/officialcard/d0e1aacce5e6b86b1d22b981b0a1ed77_originalsize.jpeg",
                    size: new AMap.Size(52, 52),
                    imageSize: new AMap.Size(36,36)})

            })
            marker.on("click", clickHandler)
            map.add(marker)
        },
        methods: {}
    }
</script>

<style scoped>

</style>
